<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title id="mytitle">博客列表</title>
    <link rel="stylesheet" href="css/conmmon.css">
    <link rel="stylesheet" href="css/blog_list.css">
    <script src="js/jquery.min.js"></script>
    <script src="js/common.js"></script>
    <script src="js/afterLogin.js"></script>
</head>

<body>
    <!-- 导航栏 -->
    <div class="nav">
        <img src="img/default.jpg" alt="">
        <a class="title" href="blog_list.html">博客系统</a>
        <!-- 用来占据中间位置 -->
        <span class="spacer"></span>
        <a href="javascript:myIndex()">我的主页</a>
        <a href="myinfo.html">个人资料</a>
        <a href="blog_add.html">写博客</a>
        <a href="javascript:mydraft()">我的草稿</a>
        <a href="private_letter.html">好友</a>
        <a href="javascript:logout()">注销</a>
    </div>

    <!-- 版心 -->
    <div class="container">
        <!-- 左侧个人信息 -->
        <div class="container-left">
            <div class="card">
                <img src="img/default.jpg" id="photo" class="avtar" alt="">
                <h3 id="username">cyk</h3>
                <div id="followDiv">
                    <!-- <a href="" id="follow">
                        <span id="#follow-msg">关注?</span>
                    </a> -->
                </div>
                <a href="#" id="gitee" target="_blank">github 地址</a>
                <div class="counter">
                    <img src="img/writeLogo.png">
                    <div>创作 <span id="artCount"></span> 篇文章</div>
                </div>
                <div class="counter">
                    <img src="img/likesLogo.png" alt="">
                    <div>获得 <span id="likesCount"></span> 次点赞</div>
                </div>
                <div class="counter">
                    <img src="img/commentLogo.png" alt="">
                    <div>内容获得 <span id="commentsCount"></span> 次评论</div>
                </div>
            </div>
        </div>
        <!-- 右侧内容详情 -->
        <div class="container-right">
            <!-- 信息选择框 -->
            <div class="selectInfo">
                <span onclick="getMyArtList()">文章<span id="blog-num">-1</span></span>
                <span onclick="getFanList()">粉丝<span id="fan-num">-1</span></span>
                <span onclick="getFollowList()">关注</span>
            </div>
            <!-- 内容填充 -->
            <div id="listInfo">

                <!-- 博客 -->
                <!-- <div class="blog">
                <a href="blog_content.html">
                    <div class="title">这是一篇博客</div>
                    <div class="desc">
                        我要努力学习!我要努力学习我要努力学习我要努力学习我要努力学习
                    </div>
                    <div class="other">
                        <span id="yc">原创</span>

                        <span id="date">博客发布于:2022-11-25</span>

                        <img src="img/阅读.png" alt="">
                        <span id="read">100</span>

                        <img src="img/likes.png" alt="">
                        <span id="likes">1</span>

                        <a href="" id="edit">修改文章</a>
                        <a href="" id="del">删除文章</a>
                    </div>
                </a>
            </div>
            <hr> -->

                <!-- 粉丝/关注
                <div class="fan">
                    <img src="img/default.jpg" alt="" id="fan-img">
                    <a href="" id="fan-nikename">cyk</a>
                    <div class="fan-div">
                        <a href="" id="follow" style="margin-right: 30px;">
                            <span id="follow-msg">关注?</span>
                        </a>
                    </div>
                </div> -->


            </div>
        </div>
    </div>

    <script>

        //获取 url 中的 id 判断是哪个用户的个人博客
        var autId = getUrlValue("id");

        //获取用户的所有信息
        function getUserInfo(id) {
            var username = jQuery('#username');
            var artCount = jQuery('#artCount');
            var likes = jQuery('#likesCount');
            var comments = jQuery('#commentsCount');
            var title = jQuery('#mytitle');
            var followDiv = jQuery('#followDiv');
            jQuery.ajax({
                type: 'GET',
                url: '/user/showinfo',
                data: { "id": id },
                success: function (result) {
                    if (result != null && result.code == 200 && result.data != null) {
                        //用户信息获取成功
                        jQuery("#photo").attr("src", result.data.photo);
                        //检测是否有 gitee 地址
                        var gitee = jQuery("#gitee");
                        if (result.data.gitee == null || result.data.gitee == "") {
                            //不存在 gitee 地址
                            gitee.text("暂无 gitee 地址");
                        } else {
                            //存在
                            gitee.attr("href", result.data.gitee);
                            gitee.text("gitee 地址");
                        }
                        //用户基本信息
                        username.text(result.data.nickname);
                        title.text(result.data.nickname + "的主页");
                        artCount.text(result.data.artCount);
                        likes.text(result.data.likes);
                        comments.text(result.data.comments);
                        //检验是否为当前用户
                        if (result.data.follow != null) {
                            var followList = "";
                            followList += '<a href="javascript:clickFollow(' + result.data.id + ',' + result.data.follow + ')" id="follow">';
                            if (result.data.follow) {
                                followList += '<span id="follow-msg">已关注</span>';
                            } else {
                                followList += '<span id="follow-msg">+关注</span>';
                            }
                            followList += '</a>';
                            followDiv.html(followList);
                        }
                        //信息选择框文章数
                        jQuery("#blog-num").text(result.data.artCount);
                        jQuery("#fan-num").text(result.data.fans);
                    } else {
                        alert("用户信息获取失败");
                    }
                }
            });
        }
        getUserInfo(autId);

        //获取文章列表数据
        function getMyArtList() {
            jQuery.ajax({
                type: 'POST',
                url: '/art/mylist',
                data: { "uid": autId },
                success(result) {
                    if (result != null || result.code == 200) {
                        //有两种情况，一种是发表了文章，一种是没有发表文章
                        if (result.data != null && result.data.length > 0) {
                            //用户发表了文章
                            var artListDiv = "";
                            for (var i = 0; i < result.data.length; i++) {
                                //拿到每一篇博客
                                var artItem = result.data[i];
                                artListDiv += '<div class="blog">';
                                artListDiv += '<a href="blog_content.html?id=' + artItem.id + '" target="_blank">';
                                artListDiv += '<div class="title">' + artItem.title + '</div>';
                                artListDiv += '<div class="desc">';
                                artListDiv += artItem.content;
                                artListDiv += '</div>';
                                artListDiv += '<div class="other">';
                                artListDiv += '<span id="yc">原创</span>';
                                artListDiv += '<span id="date">博客发布于:' + artItem.createtime + '</span>';
                                artListDiv += '<img src="img/阅读.png" alt="">';
                                artListDiv += '<span id="read">' + artItem.rcount + '</span>';
                                artListDiv += '<img src="img/likes.png" alt="">';
                                artListDiv += '<span id="likes">' + artItem.likes + '</span>';
                                if (autId == myId) {
                                    artListDiv += '<a href="blog_edit.html?id=' + artItem.id + '" id="edit" target="_blank">修改文章</a>'
                                    artListDiv += '<a href="javascript:delArt(' + artItem.id + ')" id="del">删除文章</a>'
                                }
                                artListDiv += '</div>';
                                artListDiv += '</a>';
                                artListDiv += '</div>';
                                artListDiv += '<hr>';
                            }
                            //将 html 填充进去
                            jQuery("#listInfo").html(artListDiv);
                        } else {
                            //用户未发表过文章
                            jQuery("#listInfo").html("<h3>暂无文章 <h3>");
                        }
                    } else {
                        alert("文章查询出错，请稍后重试!");
                    }
                }
            });
        }
        getMyArtList();

        //获取粉丝列表数据
        function getFanList() {
            jQuery.ajax({
                type: "POST",
                url: "/user/fanlist",
                data: {
                    "uid": autId,
                },
                success: function (result) {
                    if (result != null && result.code == 200) {
                        //获取成功
                        var fanList = "";
                        for (var i = 0; i < result.data.length; i++) {
                            var fan = result.data[i];
                            fanList += '<div class="fan">';
                            fanList += '<img src="' + fan.photo + '" alt="" id="fan-img">';
                            fanList += '<a href="myblog_list.html?id=' + fan.id + '" id="fan-nikename" target="_blank">' + fan.nickname + '</a>';
                            fanList += '<div class="fan-div">';
                            //检验是否为当前用户
                            if (fan.follow != null) {
                                fanList += '<a href="javascript:clickFollow(' + fan.id + ',' + fan.follow + ','+1+')" id="follow" style="margin-right: 30px;">';
                                if (fan.follow) {
                                    fanList += '<span id="follow-msg">已关注</span>';
                                } else {
                                    fanList += '<span id="follow-msg">+关注</span>';
                                }
                                fanList += '</a>';
                            }
                            fanList += '</div>';
                            fanList += '</div>';
                        }
                        //填充粉丝列表信息
                        jQuery("#listInfo").html(fanList);
                    } else {
                        alert("粉丝列表信息获取失败!");
                    }
                }
            });
        }

        //获取关注列表
        function getFollowList() {
            jQuery.ajax({
                type: "POST",
                url: "/user/concernlist",
                data: {
                    "uid": autId
                },
                success: function(result) {
                    if(result != null && result.code == 200) {
                        //获取成功
                        var fanList = "";
                        for (var i = 0; i < result.data.length; i++) {
                            var fan = result.data[i];
                            fanList += '<div class="fan">';
                            fanList += '<img src="' + fan.photo + '" alt="" id="fan-img">';
                            fanList += '<a href="myblog_list.html?id=' + fan.id + '" id="fan-nikename" target="_blank">' + fan.nickname + '</a>';
                            fanList += '<div class="fan-div">';
                            //检验是否为当前用户
                            if (fan.follow != null) {
                                fanList += '<a href="javascript:clickFollow(' + fan.id + ',' + fan.follow +','+2+')" id="follow" style="margin-right: 30px;">';
                                if (fan.follow) {
                                    fanList += '<span id="follow-msg">已关注</span>';
                                } else {
                                    fanList += '<span id="follow-msg">+关注</span>';
                                }
                                fanList += '</a>';
                            }
                            fanList += '</div>';
                            fanList += '</div>';
                        }
                        //填充粉丝列表信息
                        jQuery("#listInfo").html(fanList);
                    } else {
                        alert("关注列表获取失败!");
                    }
                }
            });
        }


        //删除文章
        function delArt(id) {
            if (confirm("确定删除该文章?")) {
                jQuery.ajax({
                    type: 'POST',
                    url: '/art/del',
                    data: { "id": id }, //删除文章的根据
                    success: function (result) {
                        if (result != null && result.code == 200 && result.data == 1) {
                            //文章删除成功
                            alert("恭喜你，文章删除成功!");
                            //刷新页面
                            location.href = location.href;
                        } else {
                            alert("文章删除失败，请稍后再试!");
                        }
                    }
                });
            }
        }


    </script>

</body>

</html>